<template>
  <div class="head-title">
    <van-nav-bar left-text="返回" :title="title"  left-arrow fixed  @click-left="onClickLeft" />

    <!-- <van-list v-model="loading" :finished="finished" finished-text="没有更多了"  @load="onLoad"> -->
    <van-cell-group class="message">
      <!-- <div  class="message"> -->
      <div  v-for="(item,index) in this.messageList" :key="index" class="content">
        <van-row>
          <van-col span="18" >
          <van-row>
          <van-col span="4" class="name">
            <span>
              <img :src="item.head_image"  class="commitImage" />
            </span>
          </van-col>
          <van-col span="20" class="conmit">
            <van-row>
              <van-col span="12">
                 <span class="autr">{{item.createUserName}}</span>
              </van-col>
               <!-- <van-col span="2" offset = '7'>
                <span class="LinkNum" >{{item.Num}}</span>
              </van-col> -->
              <!-- <van-col span="3" >
                 <span class="autrLiNK" @click="AddLike(index,item)">点赞</span>
              </van-col>               -->
            </van-row>

            <span class="conmitNote">{{item.content}}</span>
            
            <van-row class="resActive">
              <van-col span="8">
                <span class="restime">{{item.Time}}</span>
              </van-col>
              <van-col span="8">
                <span class="reqsDis" @click="reqsDis(index)">{{item.answerCount}}回复</span>
              </van-col>
              <van-col span="8">
                <span class="resCommit resCommitDel " @click="DeleteDiscuss(index)">x</span>
              </van-col>
            </van-row>
          </van-col>
        </van-row>
          </van-col>
          <van-col span="6" >
           <span class="toDiscussContent">{{item.toDiscussContent}}</span>
          </van-col>
        </van-row>
     
      </div>
    </van-cell-group>

    <!-- </van-list> -->
  </div>
</template>

<script>

// import iconall from "@/assets/Image/all.png";
// import iconall01 from "@/assets/Image/all01.png";
// import iconcheck from "@/assets/Image/check.png";
// import iconcheck01 from "@/assets/Image/check01.png";
// import iconready from "@/assets/Image/ready.png";
// import iconready01 from "@/assets/Image/ready01.png";
// import iconsumbit from "@/assets/Image/sumbit.png";
// import iconsumbit01 from "@/assets/Image/sumbit01.png";

export default {
  data() {
    return {
      list: [],
      list2:[],
      loading: false,
      finished: false,
      title: "",
      Lote:'',
      messageList:[]
    };
  },
  methods: {
    onLoad() {
      // 异步更新数据
      // setTimeout 仅做示例，真实场景中一般为 ajax 请求
      setTimeout(() => {
        // for (let i = 0; i < 10; i++) {
        //   this.list.push(this.list.length + 1);
        // }

        // 加载状态结束
        this.loading = false;

        // 数据全部加载完成
        if (this.list.length >= 40) {
          this.finished = true;
        }
      }, 1000);
    },
    //获取某个用户的所有评论或回复
    GetMyDiscussPageList() {
      const PWD = JSON.parse(sessionStorage.getItem("PWD"));
      this.$axios({
        method: "post",
        url: "/api/User/QueryMyDiscussPageList",
        headers: {sessionKey:PWD.sessionKey,authorization:PWD.token},
        data: {
          pageIndex: 1,//获取或设置 当前页码。
          pageSize: 20,//获取或设置 每页显示数据量。
          recordCount:30//获取或设置 所有符合查询条件的总数据量。
        }
      })
        .then(res => {
          if (res.data.code === 0) {
            console.log('s');
            console.log(res.data.data.resultList)
            
            for (var i = 0; i < res.data.data.resultList.length; i++) {
                 res.data.data.resultList[i].Time = new Date(res.data.data.resultList[i].lastAnswerTime).toLocaleDateString();
                 this.messageList = res.data.data.resultList;
            }

          }
          if (res.data.code == 1) {
            this.$toast({
              duration: 800,
              message: res.data.Message
            });
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    goNOte(index) {
      // this.$router.push("./overWorkNote");
      this.$router.push({
        path: "/overWorkNote",
        query: {
          ID: this.list[index].id,
          title: this.list[index].title,
          categoryTitle: this.title,
          id:this.$route.query.id  
        }
      });
    },
    //返回
    onClickLeft() {
      this.$router.push("/percenter");
    }
    //以下为无效代码
  },
  //页面初始化钩子函数 created
  created() {
    // /api/User/GetMyDiscussPageList获取某个用户的所有评论或回复
    this.GetMyDiscussPageList();
    this.$emit("header", false);
    this.$emit("footer", false);
    this.title =  this.$route.query.title
  },
  //页面初始化钩子函数 mounted
  mounted() {
  }
};
</script>

<style lang="less" scoped>

.message {
  margin-top: 10px;
  margin-bottom: 60px;
  .content{
    border-bottom:1px solid #eee ;
  }
  .name {
    // background-color: red;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    // margin: 5px;
    padding: 5px;
    .commitImage {
      width: 35px;
      height: 35px;
      margin-top: 10px;
      border-radius:50% ;
      border: 1px solid #eeeeee;
      background-color: #FFCC99;
      // margin: 10px;
    }
  }
  .conmit {
    padding-left: 20px;
    border-radius: 5px;
    span {
      display: block;
      font-size: 12px;
      line-height: 20px;
    }
    .autr {
      color: #99ccff;
      padding-top: 10px;
    }
    .autrLiNK{
       text-align: end;
       padding-right: 10px;
        color: #99ccff;
      padding-top: 10px;
    }
    .LinkNum{
       text-align: center;
       margin-right: 10px;
       color: #ffffff;
       margin-top: 10px;
       width: 20px;
       height: 20px;
       border-radius:50% ;
       background-color: #FF9966;
    }
    .resCommit {
      float: right;
      // margin-right: 10px;
    }
    .resCommitDel{
      margin-left: 20px;
    }
    .resCommitDel{
      margin-top: 5px;
      padding: 1px 20px;
      border: 1px solid #eee;
      border-radius:10px ;
    }
  }
  .toDiscussContent{
    font-size: 14px;
  }
}
</style>

